<template>
  <el-dialog :visible.sync="dialogVisible" title="">
    <el-image
      style="width: 100%; height: 100%"
      :src="imageSrc"
      fit="contain"
    />
  </el-dialog>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: '',
      dialogVisible: false
    }
  },
  computed: {
    imageSrc() {
      if (this.imageUrl) {
        return require(`@/assets/${this.imageUrl}`)
      } else {
        return ''
      }
    }
  },
  methods: {
    open(imgUrl) {
      this.imageUrl = imgUrl
      this.dialogVisible = true
    }
  }
}
</script>

<style scoped lang="scss"></style>
